<div nz-row nzGutter="16">
    <div nz-col class="gutter-row" nzSpan="6" *ngFor="let item of dataSet; let i = index">
        <div class="mCar">
            <div class="imgs">
                <img [src]="item.titlePic" alt="">
            </div>
            <div class="texts">
                <div class="t">{{item.title}}</div>
                <div class="fot">
                    <span>{{item.publishTime}}</span>
                    <button nz-button nzType="default" nzSize="small" (click)="editBtn(item)">编辑</button>
                </div>
            </div>
        </div>
    </div>
</div>
<nz-pagination [(nzPageIndex)]="pageIndex" [nzShowTotal]="totalTemplate" [nzTotal]="total" nzShowSizeChanger [(nzPageSize)]="pageSize" (nzPageIndexChange)="pageChange()" (nzPageSizeChange)="pageChange()"></nz-pagination>
<ng-template #totalTemplate let-total>
    共 {{total}} 篇文章
</ng-template>

<nz-modal [(nzVisible)]="isVisible" nzTitle="修改文章封面图片" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()">
    <nz-card>
        <nz-upload nzAction="http://localhost:8084/admin/upload" nzListType="picture-card" [(nzFileList)]="fileList" [nzShowButton]="fileList.length < 1" [nzPreview]="handlePreview" [nzCustomRequest]="customReq">
            <i nz-icon type="plus"></i>
            <div class="ant-upload-text">上次图片</div>
        </nz-upload>
    </nz-card>
</nz-modal>
<nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null" (nzOnCancel)="previewVisible=false">
    <ng-template #modalContent>
        <img [src]="previewImage" [ngStyle]="{ 'width': '100%' }" />
    </ng-template>
</nz-modal>